<template>
	<view class="stageAdmin">
		<uni-nav-bar color="#ffffff" background-color="#00aded" :statusBar="true" title="后台管理" fixed="true" left-icon="left" left-text="返回" @clickLeft="back" />
		<view class="main" @click="updateOrderStatus">
			<view class="">修改运输订单状态</view>
			<uni-icons type="right" size="18px"></uni-icons>
		</view>
		<view class="poper">
			<uni-popup type="bottom" ref="poperOrder">
				<view class="margin"></view>
				<uni-easyinput v-model="transOrderNumber" placeholder="运输订单号" clearable></uni-easyinput>
				<uni-easyinput v-model="orderStatus" placeholder="运单状态" type="number"></uni-easyinput>
				<uni-easyinput v-model="remark" placeholder="理由"></uni-easyinput>
				<button type="primary" @click="submitEvent">提交</button>
				<view class="margin"></view>
			</uni-popup>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			transOrderNumber: null,
			orderStatus: null,
			remark: null
		};
	},
	methods: {
		back() {
			uni.switchTab({
				url: '/pages/index/index'
			});
		},
		updateOrderStatus() {
			this.$refs.poperOrder.open();
		},
		submitEvent() {
			uni.showModal({
				cancelText: '取消',
				confirmText: '确认',
				title: '提示',
				success: (res) => {
					this.submitOrderStatus();
				}
			});
		},
		async submitOrderStatus() {
			const res = await this.$myRequest({
				url: '/api/v1/bp/submitOrderStatus',
				data: {
					transOrderNumber: this.transOrderNumber,
					orderStatus: this.orderStatus,
					remark: this.remark
				}
			});
			if (res.data.status == 'succeed') {
				uni.showToast({
					title: '操作成功',
					duration: 2000,
					icon: 'success'
				});
				this.$refs.poperOrder.close();
			}
		}
	}
};
</script>

<style lang="scss">
.stageAdmin {
	.main {
		margin-top: 30rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-left: 20rpx;
		font-size: 18px;
		font-weight: 500;
		border-bottom: 1px solid #000;
	}
	.poper {
		.margin {
			margin-top: 20rpx;
			margin-bottom: 20rpx;
		}
	}
}
</style>
